/**
 * SmartMenu - 智能多级菜单 jQuery 插件
 * 
 * 功能特点：
 * - 支持无限级菜单嵌套
 * - 智能边界检测，自动调整菜单位置
 * - 平滑的动画过渡效果
 * - 响应式设计，支持窗口大小变化
 * - 优雅的鼠标悬停交互
 * 
 * @param {Object} options 配置选项
 * @param {number} options.animationSpeed 动画持续时间（毫秒）
 * @param {number} options.hoverDelay 鼠标离开延迟关闭时间（毫秒）
 * @param {number} options.subMenuZIndex 子菜单层级
 * @param {number} options.minLeftRightSpace 最小左右边距（像素）
 * @param {string} options.activeClass 激活状态类名
 * @param {string} options.thirdLevelWidth 三级菜单面板宽度（像素或百分比）
 * 
 * @example
 * $('.sm-nav').smartMenu({
 *     animationSpeed: 300,
 *     hoverDelay: 150,
 *     activeClass: 'current',
 *     thirdLevelWidth: '600px'
 * });
 */
(function($) {
    'use strict';
    
    $.fn.smartMenu = function(options) {
        // 如果是字符串参数，执行对应方法
        if (typeof options === 'string') {
            const method = options;
            const args = Array.prototype.slice.call(arguments, 1);
            
            return this.each(function() {
                const $menu = $(this);
                const data = $menu.data('smartMenu');
                
                if (!data) {
                    console.warn('SmartMenu not initialized on this element');
                    return;
                }
                
                if (typeof data[method] === 'function') {
                    data[method].apply(data, args);
                } else {
                    console.warn('Method "' + method + '" does not exist on SmartMenu');
                }
            });
        }

        // 默认配置参数
        const defaults = {
            animationSpeed: 200,    // 动画持续时间（毫秒）
            hoverDelay: 200,        // 鼠标离开延迟关闭时间（毫秒）
            subMenuZIndex: 1000,    // 子菜单层级
            minLeftRightSpace: 10,  // 最小左右边距（像素）
            activeClass: 'sm-active',  // 激活状态类名
            thirdLevelWidth: '576px'  // 三级菜单面板宽度
        };
        
        // 合并用户配置与默认配置
        const settings = $.extend({}, defaults, options);

        return this.each(function() {
            const $menu = $(this);
            
            // 鼠标悬停定时器管理，用于延迟关闭子菜单
            const hoverTimers = new Map();
            
            // 常用选择器缓存，提高性能
            const selectors = {
                topLevelUl: '> ul',                          // 顶层菜单容器
                topLevelLi: '> ul > li',                    // 顶层菜单项
                allSubMenus: 'ul ul',                       // 所有子菜单
                secondLevel: '> ul > li > ul',              // 二级菜单
                thirdLevel: '> ul > li > ul > li > ul',      // 三级菜单
                menuItems: 'li',                            // 所有菜单项
                hasSubMenu: 'li:has(ul)'                    // 包含子菜单的项
            };
            
            // 样式配置对象 - 定义各级菜单的样式
            const styles = {
                // 顶层菜单容器样式
                topLevelUl: {
                    display: 'flex',
                    listStyle: 'none',
                    margin: 0,
                    padding: 0
                },
                // 顶层菜单项样式
                topLevelLi: {
                    position: 'relative',
                    display: 'inline-block'
                },
                // 子菜单基础样式
                subMenuBase: {
                    position: 'absolute',
                    minWidth: '160px',
                    backgroundColor: '#fff',
                    display: 'none',
                    boxShadow: '0px 3px 29px rgba(204, 204, 204, 0.75)',
                    borderRadius: '4px',
                    margin: 0,
                    padding: "7px"
                },
                // 二级菜单特殊样式
                secondLevel: {
                    top: '100%',
                    left: 0,
                    borderRadius: '0 0 4px 4px'
                },
                // 三级菜单特殊样式 - 用于横向展开的大型菜单
                thirdLevel: {
                    display: 'unset',
                    listStyle: 'none',
                    boxShadow: 'unset',
                    border: 'unset',
                    position: 'relative',
                    width: '576px',
                    top: 'unset',
                    left: 'unset',
                    right: 'unset',
                    zIndex: 'unset',
                    padding: 0
                }
            };

            /**
             * 初始化菜单样式
             * 为各级菜单应用基础样式和交互样式
             */
            function initStyles() {
                const $topUl = $menu.find(selectors.topLevelUl);
                const $topLis = $menu.find(selectors.topLevelLi);
                const $allSubMenus = $menu.find(selectors.allSubMenus);
                const $secondLevel = $menu.find(selectors.secondLevel);
                const $thirdLevel = $menu.find(selectors.thirdLevel);

                // 一级菜单样式应用
                $topUl.css(styles.topLevelUl);
                $topLis.css(styles.topLevelLi);
                
                // 为有子菜单的项添加箭头指示器
                $topLis.filter(selectors.hasSubMenu).find('> a').each(function() {
                    if (!$(this).find('.sm-top-arrow').length) {
                        $(this).append("<span class='sm-top-arrow'></span>");
                    }
                });
                
                // 子菜单基础样式应用
                $allSubMenus.each(function(index) {
                    const $subMenu = $(this);
                    $subMenu.css({
                        ...styles.subMenuBase,
                        zIndex: settings.subMenuZIndex + index + 1,  // 递增层级确保正确覆盖
                        top: 0,
                        left: '100%'  // 默认从右侧展开
                    });
                });

                // 二级菜单特殊处理 - 垂直下拉样式
                $secondLevel.each(function(index) {
                    const $subMenu = $(this);
                    $subMenu.css({
                        ...styles.subMenuBase,
                        ...styles.secondLevel
                    });
                    
                    // 二级菜单项样式处理
                    if($subMenu.find(selectors.hasSubMenu).length > 0) {
                        $subMenu.css({
                            'padding': '0'
                        });
                        // 包含三级菜单的二级菜单样式
                        $subMenu.find('> li').css({
                            display: 'flex',
                            margin: '7px'
                        });
                        
                        // 二级菜单项链接样式
                        $subMenu.find('> li > a').each(function() {
                            $(this).css({
                                width: '120px',
                                textAlign: 'right'
                            });
                            if (!$(this).next('.sm-separator').length) {
                                $(this).after('<div class="sm-separator"></div>');  // 分隔符
                            }
                        });
                        
                        // 为二级菜单项添加悬停效果
                        $subMenu.find('> li').each(function() {
                            var $li = $(this);
                            if ($li.children('ul').length) {
                                // 有子菜单的项 - 禁用悬停背景色
                                $li.find(' > a').hover(function() {
                                    $(this).css('background-color', '');
                                }, function() {
                                    $(this).css('background-color', '');
                                });
                                $li.find(' > a').css('cursor', 'unset');  // 禁用指针样式
                            } else {
                                // 无子菜单的项 - 添加悬停背景色
                                $li.find(' > a').hover(function() {
                                    $(this).css('background-color', '#ededed');
                                }, function() {
                                    $(this).css('background-color', '');
                                });
                            }
                        });
                    } else {
                        // 不包含三级菜单的二级菜单样式
                        $subMenu.find('> li > a').hover(function(){
                            $(this).css({
                                'background-color': '#ededed'
                            });
                        },function(){
                            $(this).css({
                                'background-color': ''
                            });
                        });
                    }
                });

                // 三级菜单样式 - 横向展开的大型菜单
                $thirdLevel.each(function() {
                    const $subMenu = $(this);
                    $subMenu.css({
                        ...styles.thirdLevel,
                        width: settings.thirdLevelWidth  // 使用配置项中的宽度
                    });

                    // 三级菜单项网格布局
                    $subMenu.find('> li').css({
                        float: 'left',
                        width: '25%'  // 四列布局
                    }).filter(':has(ul)').find('> a').each(function() {
                        if (!$(this).find('.sm-arrow').length) {
                            $(this).append("<span class='sm-arrow'></span>");  // 子菜单箭头
                        }
                    });
                });

                // 为有子菜单的项设置相对定位，确保子菜单正确定位
                $menu.find(selectors.hasSubMenu).css('position', 'relative');
            }

            /**
             * 显示子菜单的统一接口
             * @param {jQuery} $element 当前菜单项的jQuery对象
             */
            function showSubMenu($element) {
                const $submenu = $element.children('ul');
                if (!$submenu.length) return;

                // 清除该菜单项的关闭定时器，防止刚打开就关闭
                const elementIndex = $element.index();
                if (hoverTimers.has(elementIndex)) {
                    clearTimeout(hoverTimers.get(elementIndex));
                    hoverTimers.delete(elementIndex);
                }

                // 隐藏同级菜单，确保一次只显示一个子菜单
                $element.siblings().each(hideSiblingSubMenus);

                // 设置激活状态和位置
                setActiveState($element);

                // 三级菜单除外
                if (!$element.closest('li > ul > li').length) {
                    autoAdjustPosition($element);
                }
                
                // 使用slideDown动画显示子菜单
                $submenu.stop(true, true).slideDown(settings.animationSpeed);
            }

            /**
             * 隐藏同级子菜单的辅助函数
             * 用于showSubMenu中遍历隐藏兄弟菜单的子菜单
             */
            function hideSiblingSubMenus() {
                const $sibling = $(this);
                const $submenu = $sibling.children('ul');
                if ($submenu.length) {
                    $submenu.slideUp(settings.animationSpeed);
                }
            }

            /**
             * 自动调整菜单位置，确保菜单不会超出视窗边界
             * @param {jQuery} $parent 父级菜单项的jQuery对象
             */
            function autoAdjustPosition($parent) {
                const $submenu = $parent.children('ul');
                if (!$submenu.length) return;

                const parentOffset = $parent.offset();
                const parentWidth = $parent.outerWidth();
                const windowWidth = $(window).width();
                const submenuWidth = $submenu.outerWidth();
                const isSecondLevel = $parent.parent().is($menu.find(selectors.topLevelUl));

                // 计算最佳位置
                const position = calculatePosition(
                    parentOffset.left,
                    parentWidth,
                    submenuWidth,
                    windowWidth,
                    isSecondLevel
                );

                // 应用计算后的位置
                $submenu.css(position);
            }

            /**
             * 计算菜单的最佳显示位置
             * @param {number} parentLeft 父元素左侧位置
             * @param {number} parentWidth 父元素宽度
             * @param {number} submenuWidth 子菜单宽度
             * @param {number} windowWidth 窗口宽度
             * @param {boolean} isSecondLevel 是否为二级菜单
             * @returns {Object} 包含left、right、top值的位置对象
             */
            function calculatePosition(parentLeft, parentWidth, submenuWidth, windowWidth, isSecondLevel) {
                const spaceNeeded = settings.minLeftRightSpace;
                
                if (isSecondLevel) {
                    // 二级菜单：垂直下拉，从父元素下方开始
                    const position = { left: 0, right: 'auto' };
                    // 检查右侧边界，如超出则考虑右对齐
                    if (parentLeft + submenuWidth > windowWidth - spaceNeeded) {
                        // 检查左侧边界，如果左侧也超出，则保持右侧显示
                        if (parentLeft - submenuWidth < spaceNeeded) {
                            // 左侧也超出边界，保持右侧显示（即使会超出边界）
                            position.left = 0;
                            position.right = 'auto';
                        } else {
                            // 只有右侧超出，左侧有足够空间，切换到右侧对齐
                            position.left = 'auto';
                            position.right = 0;
                        }
                    }
                    
                    return position;
                } else {
                    // 其他层级：水平展开，从父元素右侧开始
                    const position = { left: '100%', right: 'auto', top: 0 };
                    
                    // 检查右侧边界，如超出则左侧展开
                    if (parentLeft + parentWidth + submenuWidth > windowWidth - spaceNeeded) {
                        // 检查左侧边界，如果左侧也超出，则保持右侧显示
                        if (parentLeft - submenuWidth < spaceNeeded) {
                            // 左侧也超出边界，保持右侧显示
                            position.left = '100%';
                            position.right = 'auto';
                        } else {
                            // 只有右侧超出，左侧有足够空间，切换到左侧展开
                            position.left = 'auto';
                            position.right = '100%';
                        }
                    }
                    
                    return position;
                }
            }

            /**
             * 设置菜单项的激活状态
             * 为当前菜单项及其所有父级菜单项添加激活类
             * @param {jQuery} $element 当前激活的菜单项
             */
            function setActiveState($element) {
                // 移除所有激活状态
                $menu.find(selectors.menuItems).removeClass(settings.activeClass);
                
                // 向上遍历父级菜单，添加激活状态
                let $current = $element;
                while ($current.length && $current.closest('.sm-nav').length) {
                    if ($current.is('li')) {
                        $current.addClass(settings.activeClass);
                    }
                    $current = $current.parent().closest('li');
                }
            }

            /**
             * 隐藏子菜单（带延迟）
             * 使用定时器延迟关闭，防止用户意外移出菜单
             * @param {jQuery} $element 要隐藏的菜单项
             */
            function hideSubMenu($element) {
                const $submenu = $element.children('ul');
                if (!$submenu.length) return;
                // 设置延迟关闭定时器
                setTimeout(() => {
                    $submenu.stop(true, true).slideUp(settings.animationSpeed);
                }, settings.hoverDelay);
            }

            /**
             * 绑定所有交互事件
             * 包括鼠标悬停、离开、窗口大小变化等事件
             */
            function bindEvents() {
                const $topLevelItems = $menu.find(selectors.topLevelLi);
                const $subMenuItems = $menu.find('li > ul > li > ul li:has(ul)');

                // 一级菜单事件绑定
                $topLevelItems.each(function() {
                    const $li = $(this);
                    
                    // 鼠标进入显示子菜单
                    $li.on('mouseenter', () => {
                        showSubMenu($li);
                    });
                    
                    // 鼠标离开延迟关闭
                    $li.on('mouseleave', handleMouseLeave);
                });
                
                // 三级及以下菜单事件绑定
                $subMenuItems.each(function() {
                    const $li = $(this);
                    
                    // 鼠标进入显示子菜单
                    $li.on('mouseenter', () => {
                        showSubMenu($li);
                    });
                    
                    // 鼠标离开延迟关闭
                    $li.on('mouseleave', handleMouseLeave);
                });
                
                // 窗口大小变化事件 - 使用防抖优化性能
                let resizeTimer;
                $(window).on('resize', () => {
                    clearTimeout(resizeTimer);
                    resizeTimer = setTimeout(resetMenuPositions, 100);
                });
            }

            /**
             * 鼠标离开处理函数
             * 智能判断是否需要关闭子菜单，防止意外关闭
             * @param {Event} e 鼠标事件对象
             */
            function handleMouseLeave(e) {
                const $li = $(this);
                hideSubMenu($li);
                setTimeout(() => {
                    $li.removeClass(settings.activeClass);
                }, settings.hoverDelay);
            }

            /**
             * 重置所有可见菜单的位置
             * 在窗口大小变化时调用，确保菜单不会超出视窗
             */
            function resetMenuPositions() {
                const $visibleMenus = $menu.find('ul:visible');
                $visibleMenus.each(function() {
                    const $menuItem = $(this).parent();
                    // 三级菜单除外
                    if (!$menuItem.closest('li > ul > li').length) {
                        autoAdjustPosition($menuItem);
                    }
                });
            }

            /**
             * 销毁插件
             * 清理所有事件监听器、定时器、样式和添加的DOM元素
             */
            function destroy() {
                // 清理所有定时器
                hoverTimers.forEach(timer => clearTimeout(timer));
                hoverTimers.clear();
                
                // 移除所有事件监听器
                $menu.find(selectors.topLevelLi).off('mouseenter mouseleave');
                $menu.find('li > ul > li > ul li:has(ul)').off('mouseenter mouseleave');
                $(window).off('resize', resetMenuPositions);
                
                // 隐藏所有子菜单
                $menu.find(selectors.allSubMenus).hide();
                
                // 移除激活状态类
                $menu.find(selectors.menuItems).removeClass(settings.activeClass);
                
                // 移除动态添加的DOM元素
                $menu.find('.sm-top-arrow, .sm-arrow, .sm-separator').remove();
                
                // 移除动态添加的样式
                $menu.find(selectors.topLevelUl).removeAttr('style');
                $menu.find(selectors.topLevelLi).removeAttr('style');
                $menu.find(selectors.allSubMenus).removeAttr('style');
                $menu.find(selectors.hasSubMenu).removeAttr('style');
                
                // 移除插件数据
                $menu.removeData('smartMenu');
            }

            /**
             * 初始化插件
             * 执行样式初始化和事件绑定
             */
            function init() {
                initStyles();
                bindEvents();
                // 确保顶层菜单可见（防止因CSS或JS隐藏）
                $menu.find(selectors.topLevelUl).show();
                
                // 存储销毁方法到元素数据
                $menu.data('smartMenu', { destroy: destroy });
            }
            
            // 启动插件
            init();
        });
    };
}(jQuery));